<template>
      <section class="jumbotron">
      <h3 class="jumbotron-heading">Search Github Users</h3>
      <div>
        <input type="text" placeholder="enter the name you search" v-model="keyword"/>&nbsp;
        <button @click="searchUsers">Search</button>
      </div>
    </section>
</template>
<script>
import axios from 'axios'
import emitter from '../eventBus'
export default {
    name:'Search',
    data(){
        return {
            keyword:''
        }
    },
    methods:{
        searchUsers(){
            emitter.emit('sendUserList',{isFirst:false, isLoading:true, users:[], errorMsg:''})
            axios.get(`https://api.github.com/search/users?q=${this.keyword}`).then(
                response =>{
                    console.log('请求成功',response.data.items)
                    emitter.emit('sendUserList',{isFirst:false, isLoading:false, users:response.data.items, errorMsg:''})
                },
                error =>{
                    console.log('请求失败',error.message)
                    emitter.emit('sendUserList',{isLoading:false, users:[], errorMsg:error.message})
                }
            )
        }
    }
}
</script>
<style>
</style>